import axios from 'axios'
import router from '@/router'
// 导入Element 提供的 Message组件
// import { MessageBox, Message } from 'element-ui'
import { Message } from 'element-ui'
// import { getToken } from '@/utils/auth'

// 导入store模块
import store from '@/store'

// 创建 axios 实例
const service = axios.create({
  // process是Node的全局变量，提供了当前Node.js进程的信息
  // process.env 属性返回的是一个包含用户环境信息的对象
  // process.env.VUE_APP_BASE_API 是我们自己配置的一个变量，代表的是我们配置的项目根域名

  // 这个变量模板 作者已经帮我们配置了，在哪里配置的？
  // 在项目的根目录下有两个 .env 开头的文件

  // Vue-cli 是基于谁来开发的？ 对 webpack进行了封装，都是基于Node来运行的
  // 当我们运行 npm run dev 的时候，实际上是通过 Node 来解析，运行项目的代码(通过 webpack)
  // 当运行 npm run dev 的时候， 是运行开发环境，vue-cli 就自带一个全局的变量(development)
  // node 通过本身的属性能够获取到 vue-cli 中的 development 属性，从而判断是否是 开发环境
  // 如果是开发环境，就会去找到项目根目录下面的 .ent.development 这个文件，从而解析，获取其他的代码

  // 在项目的根目录下 还有一个 .env.production 这个文件，这个文件是运行打包的时候才会执行
  // 当运行npm run build 的时候 .vue-cli 也自带了一个属性 (production)
  // node 通过本身的属性能够获取到 vue-cli 中的 production 属性，从而判断是否是 生产环境
  // 如果是生产环境，就会解析，.env.production 这个文件
  // baseURL: 'http://ihrm-java.itheima.net', // 设置axios请求的基础的基础地址

  baseURL: process.env.VUE_APP_BASE_API, // 请求基准路径
  // withCredentials: true, // send cookies when cross-domain requests
  timeout: 5000 // 请求超时的设置，如果过了 5秒，服务器没有响应，就会报错
})

// 添加请求拦截器
service.interceptors.request.use(
  config => {
    // 先从vuex中获取到token
    const token = store.state.user.token
    // 判断token是否存在
    // 如果存在，给请求头统一设置即可
    if (token) {
      config.headers['Authorization'] = `Bearer ${token}`
    }
    return config
  },
  error => {
    return Promise.reject(error)
  }
)

// 添加响应拦截器
service.interceptors.response.use(
  response => {
    // 如果success为true，说明请求成功，如果成功，直接把数据返回即可
    if (response.data.success) {
      // 数据正常，进行的逻辑功能
      // 提示文本
      // Message({
      //   message: response.data.message,
      //   type: 'success'
      // })
      return response.data
    } else {
      // 如果返回的 success 是 false，表明业务出错，直接触发 reject，
      // 将错误结果抛出
      // 抛出的错误，被 catch 捕获
      Message({
        message: response.data.message,
        type: 'error'
      })
      return Promise.reject(new Error(response.data.message))
    }
  },
  // 超过2xx范围的状态码都会触发该函数
  async error => {
    // 对响应错误做点什么
    // 多重验证，保证程序的健壮性
    if (error.response && error.response.data && error.response.data.code === 10002) {
      // 清除用户信息，token
      await store.dispatch('user/userLogout')
      // 跳转到登录页面
      router.push('/login')
      // 给用户提示
      Message({
        message: '令牌失效,请重新登录!',
        type: 'error'
      })
    }
    return Promise.reject(error)
  }
)

export default service
